<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>LayuiCMSluyun-登录</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link href="/plugins/layui/css/layui.css" rel="stylesheet" />
    <link href="/css/layadmin.css" rel="stylesheet" />
    <link href="/css/laylogin.css" rel="stylesheet" />
    <link href="favicon.ico" type="image/x-icon" rel="shortcut icon" />
</head>

<body class="layui-layout-body" style="background: url('/images/login.jpg') no-repeat; background-size: 100% 100%;">
    <script src="/plugins/jquery.min.js"></script>
    <script src="/plugins/layui/layui.js"></script>
    <script src="js/javascript.util.js"></script>
    <style>
        .beijtoum {
            background-color: rgba(0, 0, 0, 0.3);
            /* IE9、标准浏览器、IE6和部分IE7内核的浏览器(如QQ浏览器)会读懂 */
        }

        @media \0screen\,screen\9 {
            /* 只支持IE6、7、8 */
            .beijtoum {
                background-color: #000000;
                filter: Alpha(opacity=30);
                position: static;
                /* IE6、7、8只能设置position:static(默认属性) ，否则会导致子元素继承Alpha值 */
                *zoom: 1;
                /* 激活IE6、7的haslayout属性，让它读懂Alpha */
            }

            .beijtoum p {
                position: relative;
                /* 设置子元素为相对定位，可让子元素不继承Alpha值 */
            }
        }

        .layui-form-checkbox[lay-skin=primary] span {
            color: #fff;
        }

        #showPasswordIcon{
            position: absolute;
            right: 1px;
            top: 1px;
            width: 38px;
            line-height: 36px;
            text-align: center;
            color: #d2d2d2;
        }
    </style>
    <div id="LAY_app">
        <div class="layadmin-user-login" id="LAY-user-login" style="display: none;">

            <div class="layadmin-user-login-main">
                <div class="layadmin-user-login-box layadmin-user-login-header">
                    <h2>登录</h2>
                    <p>LayuiCMSluyun</p>
                </div>
                <div class="layadmin-user-login-box layadmin-user-login-body layui-form">
                    <div class="layui-form-item">
                        <label class="layadmin-user-login-icon layui-icon layui-icon-username" for="LAY-user-login-username"></label>
                        <input value="admin" type="text" name="username" id="LAY-user-login-username" lay-verify="username"
                            placeholder="账号" class="layui-input">
                    </div>
                    <div class="layui-form-item">
                        <label class="layadmin-user-login-icon layui-icon layui-icon-password" for="LAY-user-login-password"></label>
                        <input value="123" type="password" name="password" id="LAY-user-login-password" lay-verify="password"
                            placeholder="密码" class="layui-input">
                        <label id="showPasswordIcon">
                            <i class="layui-icon layui-icon-menu-fill"></i>
                        </label>
                    </div>
                    <div class="layui-form-item" style="display: none">
                        <input type="checkbox" name="remember" lay-skin="primary" title="记住密码">
                        <div class="layui-unselect layui-form-checkbox" lay-skin="primary"><span>记住密码</span><i class="layui-icon"></i></div>
                    </div>
                    <div class="layui-form-item">
                        <button class="layui-btn layui-btn-fluid" id="submitUser" lay-submit="" lay-filter="LAY-user-login-submit">
                            登 入
                        </button>
                    </div>
                </div>
            </div>

            <div class="layui-trans layadmin-user-login-footer beijtoum">
                <p style="color: #fff">&copy; 2019 <a style="color: #fff" href="https://gitee.com/cluyun" target="_blank">碌云</a></p>
            </div>
        </div>
    </div>
    <script>


        window.onerror = function () {
            if (getIsWeb() === false) {
                alert('必须在web服务容器中打开此网页，比如iis、Apache、Nginx等等中才可以使用（推荐iis，因为我用的iis）。');
            }
            return true;
        }
        pageKeepTop();

        $(function () {

            //首次进入页面让第一个文本框获得焦点,这样用户直接回车即可登录。
            $('[name="username"]').focus();


            var showPasswordFun = function () {
                $(this).html('<i class="layui-icon layui-icon-circle"></i>');
                $('[name="password"]').attr('type','text');
            }
            var hidePasswordFun = function () {
                $(this).html('<i class="layui-icon layui-icon-menu-fill"></i>');
                $('[name="password"]').attr('type','password');
            }

            //按住密码框小圆点可显示密码(支持移动端和PC端)
            $('#showPasswordIcon').on("mousedown",showPasswordFun).on('mouseup',hidePasswordFun).on('touchstart',showPasswordFun).on('touchend',hidePasswordFun);

            layui.use(['form', 'layer'], function () {
                var layer = layui.layer;
                var form = layui.form;

                //自定义验证规则
                form.verify({
                    username: function (value) {
                        if (value.length < 1) {
                            return '请输入账号';
                        }
                    }
                    , password: function (value) {
                        if (value.length < 1) {
                            return '请输入密码';
                        }
                    }
                });

                //提交
                form.on('submit(LAY-user-login-submit)', function (obj) {
                    var data = obj.field;
                    var user = {
                        userAcc: data.username,
                        passwd: data.password
                    }

                    $("#submitUser").addClass("layui-btn-disabled").prop("disabled", true).text("登录中…");


                    if (user.userAcc === 'admin' && user.passwd === '123') {
                        setTimeout("top.location.replace('/index.html')", "1000");
                    } else {
                        layer.msg('用户名或密码错误', { anim: 10, icon: 0 });
                        $("#submitUser").removeClass("layui-btn-disabled").prop("disabled", false).text("登 入");
                    }


                    return false;
                });



            });


            $(document).on("keyup", "input", function (event) {
                if (event.keyCode == 13) {
                    $('#submitUser').click();
                }
            });


        });
    </script>
</body>

</html>